安裝完之後你的目錄底下應該會有這些東西
my-app/
.gitignore
README.md
node_modules/
package.json
public/
index.html
favicon.ico
src/
App.css
App.js
App.test.js
index.css
index.js
logo.svg
.gitignore: 設定你的專案如果要上傳到git會忽略掉哪些東西,目前有node_module,因為它太大包上傳需要非常久,clone下來之後用npm install抓比較快
README: 讀我檔案,這個東西大概就是弄出這包的作者對這個東西的介紹之類的,沒認真看過
node_module: 這個資料夾裡面裝著一堆開發會用到的node套件,webpack啦babel啦eslint之類的很多很多,作者都貼心的幫你放進去了
pacakge.json: 跟你說建立這個專案的時候node幫你抓了些什麼東西
public: 這個資料夾裡面的index.html是這個React專案的頁面模板,之後會介紹到,你會引入進這個html檔裡面的東西也會放在這裡面
src: 這個資料夾最重要,底下放的是React的元件以及他們的css,index.js是最主要的React元件,記得元件都要放在這個資料夾底下,不然wabpack不會打包到他們,不過如果你跟我一樣有強迫症想稍微分類一下也可以,比如說分成css一個資料夾js一個資料夾,或是一個元件一個資料夾都是沒問題的
順帶一提編輯器推薦VS Code(Visual Studio Code),在專案內使用 ctrl+`可以開啟command line不用自己再另外開,對於需要使用npm指令開啟開發模式的React來說很方便,而且比起同樣是蠻常見的sublime,它不用額外安裝套件就支援JSX語法
因為目前還有其他專案在身,所以每天的篇幅不會太長,在這先跟正在看這篇文章的你道個歉,目前包含安裝以及React介紹的前置講解大概到這邊已經結束,接著就要進入正題,會介紹React的渲染以及元件化特性,還有states跟props還有生命週期的部分,那就明天見囉